<template>
	<!-- 关注"前端组件开发"公众号，可申请加入前端技术交流群 -->
	<view style="position: relative" class="towstage" @touchmove.stop.prevent="moveHandle">
		<scroll-view :class="['left', showHeader == false ? 'left_h5' : 'left_app']" :scroll-y="true" scroll-with-animation :scroll-top="scrollTop">
			<view v-for="(item, index) in classList" :key="index" class="classTitle" @tap="setCurrent(item, index)">
				<text :class="currentIndex === item.id ? 'actives' : ''">{{ item.name }}</text>
				<view class="classactive" v-if="currentIndex === item.id"></view>
			</view>
		</scroll-view>
		<!-- <view :class="['right',showHeader == false?'right_h5':'right_app']"> -->
		<z-paging :fixed="false" style="position: absolute; width: 76%; height: 100%; right: 0; bottom: 0" v-model="dataList" ref="paging" @query="queryList">
			<template #empty>
				<emptyView></emptyView>
			</template>
			<view class="goods_list" v-if="dataList.length !== 0">
				<view v-for="(item, index) in dataList" @tap="jumpDetail(item)" :key="index" class="goods_item">
					<view class="goods_right">
						<view class="goods_name">{{ item.appraisalName }}</view>
						<view class="numbers">
							{{ item.summary }}
						</view>
						<view class="price">
							<text class="money">{{ item.appraisalPeopleFalse }}测过</text>
							<text class="hx_money">{{ item.appraisalNumber }}道题</text>
						</view>
					</view>
					<image :src="$fullImageUrl(item.coverImage)"></image>
				</view>
				<!-- <view class="nodata">—— 到底啦 ——</view> -->
			</view>
		</z-paging>

		<!-- 	<view class="zanwu" v-if="dataList.length == 0">
				<text class="iconfont icon-none" style="font-size: 32upx"></text>
				<text style="font-size: 24upx">暂无商品</text>
			</view> -->
		<!-- </view> -->
	</view>
</template>

<script>
import emptyViewVue from '@/components/emptyView/emptyView.vue';
import { getAppraisalList } from '@/api/evaluate/index.js';
import config from '@/config';
export default {
	data() {
		return {
			currentIndex: 0,
			dataList: []
		};
	},
	components: {
		emptyViewVue
	},
	props: {
		classList: {
			type: Array
		},
		currentTypeId: {
			type: String
		},
		// dataList: {
		// 	type: Array
		// },
		showHeader: {
			//用来控制在APP下样式
			type: Boolean,
			default: false
		}
	},
	watch: {
		currentTypeId() {
			this.currentIndex = this.currentTypeId * 1;
			// console.log(this.currentIndex);
		}
	},
	methods: {
		moveHandle() {},
		setCurrent(item, index) {
			this.currentIndex = item.id;
			this.$emit('itemClick', item);
			this.$refs.paging.reload();
		},
		jumpDetail(e) {
			//详情跳转
			this.$emit('itemClickDetail', e);
		},
		refreshList() {
			this.$refs.paging.reload();
		},
		queryList(pageNum, pageSize) {
			const querys = {
				pageNum,
				pageSize,
				categoryId: this.currentTypeId
			};
			getAppraisalList(querys).then((res) => {
				let list = [...res.rows];
				this.$refs.paging.completeByTotal(list, res.total);
			});
		}
	}
};
</script>
<style scoped lang="scss">
@import './twoCate.scss';
</style>
